<template>
     <div class="trtr">
       <section class="taidu">
           <div class="left">
               <h2>4.5</h2>
               <p>综合评价</p>
               <span>高于周边商家48.2%</span>
           </div>
           <div class="right">
              <div class="right-top">
                  <p>服务态度</p>
                  <img src="../assets/xing.png" alt="">
                  <span>4.4</span>
              </div>
              <div class="right-cent">
                   <p>菜品评价</p>
                   <img src="../assets/xing.png" alt="">
                   <span>4.5</span>
              </div>
              <div class="right-botm">
                   <p>送达时间</p>
                   <span>47分钟</span>
              </div>
           </div>
       </section>
     </div>
</template>
<script>
    
</script>
<style scoped lang="less">
.px2rem(@name, @px) {
  @{name}: @px / 75 * 1rem;
}
  .trtr{
      width: 100%;
      height: 100vh;
      background: #eee;
    .taidu{
        width: 100%;
        .px2rem(height,260);
        display: flex;
        .left{
           width: 35%;
           .px2rem(height,260);
           display: flex;
           flex-direction: column;
           justify-content: center;
           align-items: center;
           h2{
               .px2rem(font-size,42);
               color: orangered;
           }
           p{
               .px2rem(font-size,34);
               color: #555;
           }
           span{
               .px2rem(font-size,30);
               color: #ccc;
           }
        }
        .right{
            width: 65%;
            .px2rem(height,260);
            .right-top,.right-cent,.right-botm{
                width: 100%;
                .px2rem(height,86);
                display: flex;
                p{
                    .px2rem(font-size,36);
                    line-height: 2;              
                }
                img{
                    .px2rem(width,150);
                    .px2rem(height,110);
                }
                span{
                    .px2rem(font-size,36);
                    line-height: 2;      
                }
            }
        }
    }
  }
</style>
